<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2021/7/1
  Time: 9:07
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>$</title>
    <link rel="stylesheet" href="css/css.css">
    <link rel="stylesheet" href="css/img.css">
    <script src="js/jquery-1.8.2.min.js"></script>
    <script src="js/fileupload.js"></script>
    <script>
        $(function () {
            $.ajax({
                url:"city.do",
                data:{"pid":0},
                type:"post",
                dataType:"json",
                success:function (obj) {
                    for (let i in obj) {
                        $("[name='sheng']").append("<option value="+obj[i].id+">"+obj[i].name+"</option>");
                    }
                }
            })
            $("[name='sheng']").change(function () {
                let pid = $(this).val();
                $("[name='shi']").empty();
                $("[name='shi']").append("<option value=\"\"></option>");
                $("[name='xian']").empty();
                $("[name='xian']").append("<option value=\"\"></option>");
                $.ajax({
                    url:"city.do",
                    data:{"pid":pid},
                    type:"post",
                    dataType:"json",
                    success:function (obj) {
                        for (let i in obj) {
                            $("[name='shi']").append("<option value="+obj[i].id+">"+obj[i].name+"</option>");
                        }
                    }
                })
            })
            $("[name='shi']").change(function () {
                let pid = $(this).val();
                $("[name='xian']").empty();
                $("[name='xian']").append("<option value=\"\"></option>");
                $.ajax({
                    url:"city.do",
                    data:{"pid":pid},
                    type:"post",
                    dataType:"json",
                    success:function (obj) {
                        for (let i in obj) {
                            $("[name='xian']").append("<option value="+obj[i].id+">"+obj[i].name+"</option>");
                        }
                    }
                })
            })
        })
        function fenye(pages) {
            $("[name='pages']").val(pages);
            $("form").submit();
        }
    </script>
</head>
<body>
<form action="/list.do" method="post">
    <input type="hidden" name="pages">
    用户名:<input type="text" name="name" value="${map.name}"><br>
    日期:<input type="date" name="start" value="${map.start}">--
    <input type="date" name="end" value="${map.end}"><br>
    省:<select name="sheng">
        <option value=""></option>
    </select>
    市:<select name="shi">
        <option value=""></option>
    </select>
    县:<select name="xian">
        <option value=""></option>
    </select><br>
    <input type="submit" value="查询">
</form>
<table>
    <tr>
        <td>用户编号</td>
        <td>用户登录名</td>
        <td>用户密码</td>
        <td>性别</td>
        <td>爱好</td>
        <td>日期</td>
        <td>图片</td>
        <td>省</td>
        <td>市</td>
        <td>县</td>
        <td>
            <a href="/toadd.do"><input type="button" value="注册"></a>
        </td>
    </tr>
    <c:forEach items="${pageInfo.list}" var="u">
        <tr>
            <td>${u.id}</td>
            <td>${u.name}</td>
            <td>${u.password}</td>
            <td>${u.sex}</td>
            <td>${u.hobby}</td>
            <td>${u.bdate}</td>
            <td>
                <img src="${u.pic}" alt="无法展示" width="100px">
            </td>
            <td>${u.aname}</td>
            <td>${u.bname}</td>
            <td>${u.cname}</td>
            <td>
                <a href="/toupd.do?id=${u.id}}"><input type="button" value="编辑"></a>
            </td>
        </tr>
    </c:forEach>
    <tr>
        <td colspan="20">
            <input type="button" class="btn btn-info" value="首页" onclick="fenye(1)">
            <input type="button" class="btn btn-info" value="上一页" onclick="fenye(${pageInfo.isFirstPage?1:pageInfo.prePage})">
            <input type="button" class="btn btn-info" value="下一页" onclick="fenye(${pageInfo.isLastPage?pageInfo.pages:pageInfo.nextPage})">
            <input type="button" class="btn btn-info" value="尾页" onclick="fenye(${pageInfo.pages})">
        </td>
    </tr>
</table>
</body>
</html>
